<template>
	<div class="vehicle-manager-info">
		<div class="main_content">
			<div class="main_content_title">
				<div class="left">
					<span>{{ propUpType === 'add' ? $t('publicBtn.add') : propUpType === 'edit' ? $t('publicBtn.edit') :
						$t('publicBtn.detail') }}</span>
					<template v-for="(item, index) in $route.meta.title">
						<span v-if="languageId === item.langId">{{ item.name }}</span>
					</template>
				</div>
				<div class="right" />
			</div>
			<div class="main_content_con">
				<!-- 语言动态标签页面 -->
				<el-row :gutter="24">
					<el-col :span="14">
						<elTabPane :isShow="isTag" :tagId="tagId" @tagClick="tagClick"></elTabPane>
					</el-col>
				</el-row>
				<el-form ref="info" :model="info" :rules="rules" class="demo-ruleForm">
					<el-form v-for="(info, index) in info.list" :ref="`info${index}`" :model="info" :rules="rules"
						v-show="tagId === info.langId" :key="index" label-width="110px" class="demo-ruleForm">
						<div class="content_info" v-if="propUpType !== 'detail'">
							<el-row :gutter="24">
								<el-col :span="14">
									<el-form-item :label="$t('publicFormLabel.brandName')" prop="brandId">
										<el-select v-model="info.brandId" filterable :placeholder="$t('placeholderTip.enter')"
											style="width:100%" @change="copyValue('list', 'brandId', info.brandId)">
											<el-option v-for="item in brandList" v-bind:key="item.brandId" :label="item.name"
												:value="item.id" />
										</el-select>
									</el-form-item>
								</el-col>
							</el-row>
							<el-row :gutter="24">
								<el-col :span="14">
									<el-form-item :label="$t('publicFormLabel.seriesName')" prop="seriesId" v-if="tagId === 1">
										<el-select v-model="info.seriesId" filterable :placeholder="$t('placeholderTip.enter')"
											style="width:100%" @change="copyValue('list', 'seriesId', info.seriesId)">
											<el-option v-for="item in seriesList" v-bind:key="item.id" :label="item.name" :value="item.id" />
										</el-select>
									</el-form-item>
									<el-form-item :label="$t('publicFormLabel.seriesName')" prop="name" v-if="tagId != 1">
										<el-input v-model="info.name" :placeholder="$t('placeholderTip.enter')" />
									</el-form-item>
								</el-col>
							</el-row>
							<el-row :gutter="24">
								<el-col :span="16">
									<el-form-item :label="$t('formLabel.vehicleBannerDiagram')" prop="banner">
										<div class="boxIgmContent">
											<div class="imgBox" v-for="(img, index1) in info.banner" :key="index1">
												<upload-imgs customsrc="true" :defsrc="img"
													:on-success="function (res, file) { return handleAvatarSuccess(res, file, info, 'banner', 'more', index1,) }">
													<i class="el-icon-plus avatar-uploader-icon" />
												</upload-imgs>
												<div v-if="img" class="deleteImg" @click.stop="deleteImg(info, 'banner', index1)">
													<img src="@/assets/images/close.png">
												</div>
											</div>
											<div class="avatar-uploader" v-if="info.banner.length < limit">
												<upload-imgs customsrc="true" :imgmums="info.banner.length"
													:on-success="function (res, file) { return handleAvatarSuccess(res, file, info, 'banner', 'more') }">
													<i class="el-icon-plus avatar-uploader-icon" />
												</upload-imgs>
											</div>
											<div class="tipInfo">（尺寸1920*1080）</div>
										</div>
									</el-form-item>
								</el-col>
							</el-row>
							<el-row :gutter="24">
								<el-col :span="14">
									<el-form-item :label="$t('formLabel.mainImage')" prop="seriesImg">
										<div class="avatar-uploader">
											<upload-img customsrc="true" :defsrc="info.seriesImg"
												:on-success="function (res, file) { return handleAvatarSuccess(res, file, info, 'seriesImg') }">
												<i class="el-icon-plus avatar-uploader-icon" />
											</upload-img>
										</div>
										<div v-if="info.seriesImg" class="deleteImg" @click.stop="deleteImg(info, 'seriesImg')">
											<img src="@/assets/images/close.png">
										</div>
										<div class="tipInfo">（尺寸1920*1080）</div>
									</el-form-item>
								</el-col>
							</el-row>
							<el-row :gutter="24">
								<el-col :span="14">
									<el-form-item :label="$t('publicFormLabel.thumbnail')" prop="thumbnail">
										<div class="avatar-uploader">
											<upload-img customsrc="true" :defsrc="info.thumbnail"
												:on-success="function (res, file) { return handleAvatarSuccess(res, file, info, 'thumbnail',) }">
												<i class="el-icon-plus avatar-uploader-icon" />
											</upload-img>
										</div>
										<div v-if="info.thumbnail" class="deleteImg" @click.stop="deleteImg(info, 'thumbnail',)">
											<img src="@/assets/images/close.png">
										</div>
										<div class="tipInfo">（尺寸1920*1080）</div>
									</el-form-item>
								</el-col>
							</el-row>
							<el-row :gutter="24">
								<el-col :span="14">
									<el-form-item :label="$t('publicFormLabel.video')" prop="video">
										<div class="avatar-uploader">
											<upload-video customsrc="true" :defsrc="info.video"
												:on-success="function (res, file) { return handleAvatarSuccess(res, file, info, 'video') }">
												<i class="el-icon-plus avatar-uploader-icon" />
											</upload-video>
										</div>
										<div v-if="info.video" class="deleteImg" @click.stop="deleteImg(info, 'video',)">
											<img src="@/assets/images/close.png">
										</div>
										<div class="tipInfo">（尺寸1920*1080）</div>
									</el-form-item>
								</el-col>
							</el-row>
							<el-row :gutter="24">
								<el-col :span="14">
									<el-form-item :label="$t('formLabel.UploadParameters')" prop="parametersFile">
										<div class="avatar-uploader">
											<!-- :accept="accept" -->
											<upload-img customsrc="true" :defsrc="info.parametersFile"
												:on-success="function (res, file) { return handleAvatarSuccess(res, file, info, 'parametersFile') }">
												<i class="el-icon-plus avatar-uploader-icon" />
											</upload-img>
										</div>
										<div v-if="info.parametersFile" class="deleteImg" @click.stop="deleteImg(info, 'parametersFile')">
											<img src="@/assets/images/close.png">
										</div>
										<div class="tipInfo">（尺寸1920*1080）</div>
									</el-form-item>
								</el-col>
							</el-row>
							<el-row :gutter="24">
								<el-col :span="14">
									<div style="display: flex;justify-content: space-between;">
										<el-form-item :label="$t('publicFormLabel.guidePrice')" style="width:48%;" prop="guidanceMin">
											<el-input readonly v-model="info.guidanceMin" :placeholder="$t('placeholderTip.bringOut')">
												<template slot="prepend">
													<span v-if="info.langId === 1">{{ $t('text.priceUnit') }}</span>
													<span v-else>{{ $t('text.priceDollar') }}</span>
												</template>
											</el-input>
										</el-form-item>
										<span style="margin-top: 10px;">-</span>
										<el-form-item label-width="0" label="" prop="guidanceMax" style="width:48%;">
											<el-input readonly v-model="info.guidanceMax" :placeholder="$t('placeholderTip.bringOut')">
												<template slot="prepend">
													<span v-if="info.langId === 1">{{ $t('text.priceUnit') }}</span>
													<span v-else>{{ $t('text.priceDollar') }}</span>
												</template>
											</el-input>
										</el-form-item>
									</div>
								</el-col>
							</el-row>
							<el-row :gutter="24">
								<el-col :span="14">
									<el-form-item :label="$t('formLabel.carLevel')" prop="carLevel">
										<el-select v-model="info.carLevel" filterable :placeholder="$t('placeholderTip.enter')"
											style="width:100%" @change="copyValue('list', 'carLevel', info.carLevel)">
											<el-option v-for="item in carLevelList" v-bind:key="item.id" :label="item.name" :value="item.id" />
										</el-select>
									</el-form-item>
								</el-col>
							</el-row>
							<el-row :gutter="24">
								<el-col :span="14">
									<el-form-item :label="$t('formLabel.energyType')" prop="energyType">
										<el-select v-model="info.energyType" filterable :placeholder="$t('placeholderTip.enter')"
											style="width:100%" @change="copyValue('list', 'energyType', info.energyType)">
											<el-option v-for="item in energyTypeList" v-bind:key="item.id" :label="item.name"
												:value="item.id" />
										</el-select>
									</el-form-item>
								</el-col>
							</el-row>
							<el-row :gutter="24">
								<el-col :span="14">
									<div style="display: flex;justify-content: space-between;">
										<el-form-item :label="$t('formLabel.endurance')" style="width:48%;" prop="enduranceMin">
											<el-input v-model="info.enduranceMin" :placeholder="$t('placeholderTip.enter')"
												@change="copyValue('list', 'enduranceMin', info.enduranceMin)">
												<template slot="append">{{ $t('text.kilometer') }}</template>
											</el-input>
										</el-form-item>
										<span style="margin-top: 10px;">-</span>
										<el-form-item label-width="0" label="" prop="enduranceMax" style="width:48%;">
											<el-input v-model="info.enduranceMax" :placeholder="$t('placeholderTip.enter')"
												@change="copyValue('list', 'enduranceMax', info.enduranceMax)">
												<template slot="append">{{ $t('text.kilometer') }}</template>
											</el-input>
										</el-form-item>
									</div>
								</el-col>
							</el-row>
							<el-row :gutter="24">
								<el-col :span="14">
									<el-form-item :label="$t('formLabel.isSnventory')">
										<el-radio-group v-model="info.stock" @change="copyValue('list', 'stock', info.stock)">
											<el-radio :label=1>{{ $t('text.have') }}</el-radio>
											<el-radio :label=0>{{ $t('text.notHave') }}</el-radio>
										</el-radio-group>
									</el-form-item>
								</el-col>
							</el-row>
							<el-row :gutter="24">
								<el-col :span="14">
									<el-form-item :label="$t('formLabel.starLevel')">
										<el-radio-group v-model="info.starLevel" @change="copyValue('list', 'starLevel', info.starLevel)">
											<el-radio :label=3>{{ $t('text.samsung') }}</el-radio>
											<el-radio :label=5>{{ $t('text.fiveStars') }}</el-radio>
											<el-radio :label=7>{{ $t('text.sevenStars') }}</el-radio>
										</el-radio-group>
									</el-form-item>
								</el-col>
							</el-row>
							<el-row :gutter="24">
								<el-col :span="22">
									<el-form-item :label="$t('formLabel.contextDetails')" prop="context">
										<Tinymce v-if="showTinymce" :content="info.context"
											:on-message="function (res) { return messageInfo(res, info, 'context') }" :settingData="setting"
											height="500">
										</Tinymce>
									</el-form-item>
								</el-col>
							</el-row>
							<el-row :gutter="24">
								<el-col :span="14">
									<el-form-item :label="$t('publicFormLabel.remark')" prop="remark">
										<el-input type="textarea" v-model="info.remark" rows="3" :placeholder="$t('placeholderTip.enter')" />
									</el-form-item>
								</el-col>
							</el-row>
						</div>
						<div class="content_info" v-else>
							<el-row :gutter="24">
								<el-col :span="14">
									<el-form-item :label="$t('publicFormLabel.brandName')">
										<el-input readonly v-model="info.brandName" />
									</el-form-item>
								</el-col>
							</el-row>
							<el-row :gutter="24">
								<el-col :span="14">
									<el-form-item :label="$t('publicFormLabel.seriesName')">
										<el-input readonly v-model="info.name" />
									</el-form-item>
								</el-col>
							</el-row>
							<el-row :gutter="24" v-if="info.banner.length > 0">
								<el-col :span="16">
									<el-form-item :label="$t('formLabel.vehicleBannerDiagram')">
										<div class="boxIgmContent">
											<div class="imgBox" v-for="(img, index) in info.banner" :key="index">
												<div class="avatar-uploader">
													<upload-imgs :preview="true" :defsrc="img" disabled>
														<i class="el-icon-plus avatar-uploader-icon" />
													</upload-imgs>
												</div>
											</div>
										</div>
									</el-form-item>
								</el-col>
							</el-row>
							<el-row :gutter="24">
								<el-col :span="14">
									<el-form-item :label="$t('formLabel.mainImage')">
										<div class="avatar-uploader">
											<upload-img :preview="true" :defsrc="info.seriesImg" disabled />
										</div>
									</el-form-item>
								</el-col>
							</el-row>
							<el-row :gutter="24">
								<el-col :span="14">
									<el-form-item :label="$t('publicFormLabel.thumbnail')">
										<div class="avatar-uploader">
											<upload-img :preview="true" :defsrc="info.thumbnail" disabled />
										</div>
									</el-form-item>
								</el-col>
							</el-row>
							<el-row :gutter="24">
								<el-col :span="14">
									<el-form-item :label="$t('publicFormLabel.video')">
										<div class="avatar-uploader">
											<upload-video customsrc="true" :preview="true" :defsrc="info.video" disabled>
												<i class="el-icon-video-camera" style="font-size:40px;color:#efefef" />
											</upload-video>
										</div>
									</el-form-item>
								</el-col>
							</el-row>
							<el-row :gutter="24">
								<el-col :span="14">
									<el-form-item :label="$t('formLabel.UploadParameters')">
										<div class="avatar-uploader">
											<upload-img :preview="true" :defsrc="info.parametersFile" disabled />
										</div>
									</el-form-item>
								</el-col>
							</el-row>
							<el-row :gutter="24">
								<el-col :span="14">
									<div style="display: flex;justify-content: space-between;">
										<el-form-item :label="$t('publicFormLabel.guidePrice')" style="width:48%;">
											<el-input readonly v-model="info.guidanceMin">
												<template slot="prepend">
													<span v-if="info.langId === 1">{{ $t('text.priceUnit') }}</span>
													<span v-else>{{ $t('text.priceDollar') }}</span>
												</template>
											</el-input>
										</el-form-item>
										<span style="margin-top: 10px;">-</span>
										<el-form-item label-width="0" label="" style="width:48%;">
											<el-input readonly v-model="info.guidanceMax">
												<template slot="prepend">
													<span v-if="info.langId === 1">{{ $t('text.priceUnit') }}</span>
													<span v-else>{{ $t('text.priceDollar') }}</span>
												</template>
											</el-input>
										</el-form-item>
									</div>
								</el-col>
							</el-row>
							<el-row :gutter="24">
								<el-col :span="14">
									<el-form-item :label="$t('formLabel.carLevel')">
										<el-input readonly v-model="info.carLevelName" />
									</el-form-item>
								</el-col>
							</el-row>
							<el-row :gutter="24">
								<el-col :span="14">
									<el-form-item :label="$t('formLabel.energyType')">
										<el-input readonly v-model="info.energyTypeName" />
									</el-form-item>
								</el-col>
							</el-row>
							<el-row :gutter="24">
								<el-col :span="14">
									<div style="display: flex;justify-content: space-between;">
										<el-form-item :label="$t('formLabel.endurance')" style="width:48%;">
											<el-input readonly v-model="info.enduranceMin">
												<template slot="append">{{ $t('text.kilometer') }}</template>
											</el-input>
										</el-form-item>
										<span style="margin-top: 10px;">-</span>
										<el-form-item label-width="0" label="" style="width:48%;">
											<el-input readonly v-model="info.enduranceMax">
												<template slot="append">{{ $t('text.kilometer') }}</template>
											</el-input>
										</el-form-item>
									</div>
								</el-col>
							</el-row>
							<el-row :gutter="24">
								<el-col :span="14">
									<el-form-item :label="$t('formLabel.isSnventory')">
										<el-radio-group v-model="info.stock">
											<el-radio v-if="info.stock === 1" :label=1>{{ $t('text.have') }}</el-radio>
											<el-radio v-if="info.stock === 0" :label=0>{{ $t('text.notHave') }}</el-radio>
										</el-radio-group>
									</el-form-item>
								</el-col>
							</el-row>
							<el-row :gutter="24">
								<el-col :span="14">
									<el-form-item :label="$t('formLabel.starLevel')">
										<el-radio-group v-model="info.starLevel">
											<el-radio v-if="info.starLevel === 3" :label=3>{{ $t('text.samsung') }}</el-radio>
											<el-radio v-if="info.starLevel === 5" :label=5>{{ $t('text.fiveStars') }}</el-radio>
											<el-radio v-if="info.starLevel === 7" :label=5>{{ $t('text.sevenStars') }}</el-radio>
										</el-radio-group>
									</el-form-item>
								</el-col>
							</el-row>
							<el-row :gutter="24">
								<el-col :span="20">
									<el-form-item :label="$t('formLabel.contextDetails')">
										<Tinymce :content="info.context" :settingData="setting" height="500" />
									</el-form-item>
								</el-col>
							</el-row>
							<el-row :gutter="24">
								<el-col :span="14">
									<el-form-item :label="$t('publicFormLabel.remark')">
										<el-input readonly type="textarea" v-model="info.remark" rows="3" />
									</el-form-item>
								</el-col>
							</el-row>
						</div>

					</el-form>
				</el-form>
				<div class="footerBtn">
					<el-button @click="getCancle">{{ propUpType !== 'detail' ? $t('el.popconfirm.cancelButtonText') :
						$t('el.popconfirm.close') }}</el-button>
					<el-button v-if="propUpType !== 'detail'" type="primary" @click="addSubmitForm"
						v-loading.fullscreen.lock="fullscreenLoading">{{ $t('el.popconfirm.confirmButtonText') }}</el-button>
				</div>
			</div>
		</div>
	</div>
</template>
<script>
import {
	getPublicSysCarSeries,
	getSeriesInfo,
	setSeriesSave,
	setSeriesUpdate,
} from '@/api/basics-manager';
import UploadImgSimple from '@/components/Upload/UploadImgSimple';
import UploadImgSimples from '@/components/Upload/UploadImgSimple_more';
import UploadImgvideo from '@/components/Upload/UploadImgvideo';
import Tinymce from '@/components/VueTinymceUeditor/index.vue';
import elTabPane from '@/components/el-tab-pane/index'; //语言动态标签页面
import defaultSettings from '@/settings';
export default {
	name: 'CarSeriesInfo',
	components: {
		UploadImg: UploadImgSimple,
		UploadVideo: UploadImgvideo,
		UploadImgs: UploadImgSimples, //多张图片
		elTabPane,
		Tinymce
	},
	data() {
		return {
			fileType: 'pdf',
			accept: '.pdf',
			limit: 5,
			tagId: '',//语言id 默认id 
			isTag: false,
			BASE_IMG: defaultSettings.BASE_IMG,
			info: {
				list: []
			},
			brandList: [], //品牌list
			seriesList: [], //车系list
			rules: {
				context: [
					{
						required: true,
						message: this.$t('placeholderTip.enter'),
						trigger: 'blur'
					}
				],
				brandId: [
					{
						required: true,
						message: this.$t('placeholderTip.pSelect'),
						trigger: 'change'
					}
				],
				seriesId: [
					{
						required: true,
						message: this.$t('placeholderTip.pSelect'),
						trigger: 'change'
					}
				],
				name: [
					{
						required: true,
						message: this.$t('placeholderTip.enter'),
						trigger: 'blur'
					}
				],
				banner: [
					{
						required: true,
						message: this.$t('placeholderTip.pSelect'),
						trigger: 'change'
					}
				],
				seriesImg: [
					{
						required: true,
						message: this.$t('placeholderTip.pUpload'),
						trigger: 'blur'
					}
				],
				thumbnail: [
					{
						required: true,
						message: this.$t('placeholderTip.pUpload'),
						trigger: 'blur'
					}
				],
				parametersFile: [
					{
						required: false,
						message: this.$t('placeholderTip.pUpload'),
						trigger: 'blur'
					}
				],
				guidanceMin: [
					{
						required: false,
						message: this.$t('placeholderTip.enter'),
						trigger: 'blur'
					},
					{
						required: false,
						pattern: /^[0-9\.]+$/,
						message: this.$t('placeholderTip.enterNumber'),
						trigger: 'blur'
					}
				],
				guidanceMax: [
					{
						required: false,
						message: this.$t('placeholderTip.enter'),
						trigger: 'blur'
					},
					{
						required: false,
						pattern: /^[0-9\.]+$/,
						message: this.$t('placeholderTip.enterNumber'),
						trigger: 'blur'
					}
				],
				enduranceMin: [
					{
						required: false,
						message: this.$t('placeholderTip.enter'),
						trigger: 'blur'
					},
					{
						required: false,
						pattern: /^[0-9\.]+$/,
						message: this.$t('placeholderTip.enterNumber'),
						trigger: 'blur'
					}
				],
				enduranceMax: [
					{
						required: false,
						message: this.$t('placeholderTip.enter'),
						trigger: 'blur'
					},
					{
						required: false,
						pattern: /^[0-9\.]+$/,
						message: this.$t('placeholderTip.enterNumber'),
						trigger: 'blur'
					}
				]
			},
			showTinymce: false,
			setting: {
				menubar: true, // //是否显示菜单栏
				branding: true, //取消tinymce水印
				paste_word_valid_elements: '*[*]', //word粘贴使用
				paste_data_images: true, //// 默认是false的，记得要改为true才能粘贴
				images_file_types: 'jpeg,jpg,png,gif',
				toolbar_drawer: 'sliding', //工具栏过多，点击“...”打开抽屉过度效果
				plugins: [
					'lists',
					'code',
					'table',
					'formatselect',
					'colorpicker',
					'textcolor',
					'contextmenu',
					'preview',
					'fullscreen',
					'media',
					'link',
					'image',
					'paste'
				],
				toolbar:
					'undo redo | fullscreen | alignleft aligncenter alignright alignjustify |indent_use_margin bullist | image media table | styleselect | fontselect fontsizeselect forecolor backcolor | bold italic underline strikethrough | superscript subscript | removeformat | paste|'
			},
			energyTypeList: [],//能源类型
			carLevelList: [], //级别
			propUpType: '', // 'add' edit detail
			fullscreenLoading: false,
			oldBrandId: ''
		}
	},
	computed: {
		languageId() {
			// 固定语种ID  1:中文  2:英文 3:俄文 4:乌语
			return this.$store.getters.languageId
		},
		languageList() {
			return this.$store.getters.languageList.length > 0 ? this.$store.getters.languageList : JSON.parse(localStorage.getItem('languageList'))
		}
	},
	watch: {
		propUpType: function (val) {
			if (val !== 'detail') {
				var timer = setTimeout(() => {
					this.showTinymce = true
					window.clearTimeout(timer)
				}, 500)
			} else {
				this.showTinymce = false
			}
		}
	},
	mounted() {
		window._vm = this
		this.propUpType = this.$route.query.propUpType
		if (this.$route.query.type) {
			this.type = this.$route.query.type
		}
		this.isTag = true;
		this.tagId = this.languageId;
		if (this.$route.query.propUpType === 'add') {
			this.init("1,3,4")
			var arr = []
			this.languageList.map(i => {
				var obj = {
					langId: i.id,
					id: '',
					brandId: '', // 品牌id
					brandName: '', // 品牌名称
					name: '', // 车系名称
					seriesId: '',//车系id
					banner: [], //车辆图片
					thumbnail: '', // 缩略图
					seriesImg: '',//车系主图
					video: '',//车系视频
					carLevel: '', //车辆级别
					parametersFile: '',//车系参数 //1702435360563
					energyType: '', //能源类型
					guidanceMax: '', //最高指导价
					guidanceMin: '', //最低指导价
					enduranceMax: '', //最大续航
					enduranceMin: '', //最小续航
					stock: 1,//库存 0：无 1：有
					starLevel: 3,//三星 五星
					context: '',//图文详情
					remark: "",//备注
					status: 1, // 状态 -1:删除 0:无效 1:有效
				}
				arr.push(obj)
			})
			this.info.list = arr
		} else if (this.$route.query.id) {
			this.getInfo(this.$route.query.id)
		}
	},
	created() {
		console.log('created')
	},
	activated() {

	},
	destroyed() {
	},
	methods: {
		// 富文本
		messageInfo(content, tar, key) {
			tar[key] = content
		},
		// 语言菜单处理
		tagClick(id) {
			if (id !== this.tagId) {
				this.resetForm('info', 2)
				this.tagId = id
			}
		},
		init(ids, brandId) {
			//  1: 品牌 2: erp车系 3: 车辆级别 4: 能源类型
			var params = {
				ids: ids
			}
			if (ids === '2') {
				this.brandList.map(i => {
					// 存储brandId 用id 调用接口用brandId erp品牌brandId
					if ((brandId || this.info.list[0].brandId) === i.id) {
						params['brandId'] = i.brandId
					}
				})
			}
			getPublicSysCarSeries(params).then(res => {
				if (res.code === 200) {
					if (res.data.brands) {
						var arr = []
						res.data.brands.map(i => {
							if (this.languageId === i.langId) {
								arr.push(i)
							}
						})
						this.brandList = arr
						if (this.propUpType === 'edit') {
							this.init('2')
						}
					}
					if (res.data.carLevel) {
						this.carLevelList = res.data.carLevel
					}
					if (res.data.energyType) {
						this.energyTypeList = res.data.energyType
					}
					if (res.data.erpSeries) {
						this.seriesList = res.data.erpSeries
					}
				}
			})
		},
		// 无多语言字段处理
		copyValue(key, key2, value) {
			// 车型名称获取  中文语种赋值
			var seriesName = ''
			if (this.seriesList.length > 0) {
				this.seriesList.map(i => {
					if (value === i.id) {
						seriesName = i.name
					}
				})
			}
			this.info[key].map(i => {
				if (key2 === 'brandId') {
					if (this.oldBrandId != value) {
						this.init('2', value)
						this.oldBrandId = value
						i.seriesId = ''
						i.name = ''
					}
				}
				if (key2 === 'seriesId') {
					// 车型名称获取  中文语种赋值
					if (i.langId === 1) {
						i.name = seriesName
					} else {
						i.name = ''
					}
				}
				i[key2] = value
			})
		},
		deleteImg(tar, key, index) {
			if (index >= 0) {
				//多张图片删除处理
				// 多语言
				tar[key].splice(index, 1)
			} else {
				// 非多语言字段
				if (key === 'seriesImg' || key === 'thumbnail') {
					this.info.list.map(i => {
						i[key] = ''
					})
				} else {
					// 多语言字段
					tar[key] = ''
				}
			}
			this.$forceUpdate()
		},
		handleAvatarSuccess(res, file, tar, key, type, index) {
			if (res) {
				if (type === 'more') {
					//多张图片处理
					if (index >= 0) {
						tar[key][index] = res.key
					} else {
						tar[key].push(res.key)
					}
				} else {
					// 非多语言字段
					if (key === 'seriesImg' || key === 'thumbnail') {
						this.info.list.map(i => {
							i[key] = res.key
						})
					} else {
						// 多语言字段
						tar[key] = res.key
					}
				}
				this.$forceUpdate()
			}
		},
		// 重置表单
		resetForm(vaid, type) {
			// type 1 重置表单 2仅清空校验
			if (this.$refs[vaid] !== undefined) {
				this.$nextTick(() => {
					Promise.all([
						//数组部分的表单，用map返回验证函数的调用
						...this.info.list.map((item, index) => {
							var refs = `info${index}`
							let valiForm = this.$refs?.[refs].validate
								? this.$refs?.[refs]
								: this.$refs?.[refs][0];
							if (type === 1) {
								valiForm.resetFields()
							} else {
								valiForm.clearValidate()
							}
						})

					])
				})

			}
		},
		getCheck(index) {
			var list = JSON.parse(JSON.stringify(this.info.list))
			list.splice(index, 1)
			var falg1 = []
			for (var i = 0; i < list.length; i++) {
				var item = list[i]
				// 表单校验
				var name = ''
				// 多语言必填字段 && item.guidanceMax && item.guidanceMin && item.parametersFile   if暂时去除价格  价格 不必填暂时
				if (item.name && item.banner.length > 0 && item.context) {
				} else if (item.name || item.banner.length > 0 || item.video || item.parametersFile || item.context || item.remark) {
					this.languageList.map(j => {
						if (j.id === item.langId) {
							name = j.name
						}
					})
					this.$message({
						showClose: true,
						message: name + ':' + this.$t('text.improveForms'),
						type: 'warning'
					})
					falg1.push(0)
					return false
				} else {
					falg1.push(1)
				}
			}
			var isallZeros = false
			// 判断是否包含0
			if (falg1.length > 0) {
				isallZeros = falg1.includes(0)
			}
			return !isallZeros
		},
		// 提交
		addSubmitForm() {
			var list = JSON.parse(JSON.stringify(this.info.list))
			var flag = false
			for (var i = 0; i < list.length; i++) {
				var item = list[i]
				var index = i
				// 当前语种 表单校验every
				if (this.tagId === item.langId) {
					console.log(index)
					let valiForm = this.$refs?.[`info${index}`].validate
						? this.$refs?.[`info${index}`]
						: this.$refs?.[`info${index}`][0];
					valiForm.validate((res) => {
						if (res) {
							flag = this.getCheck(index)
						} else {
							return false
						}
					})
				}
			}
			if (flag) {
				// 全部表单验证通过
				var arr = JSON.parse(JSON.stringify(this.info.list))
				arr.map(i => {
					i.banner = i.banner.toString()
					// 插入一个 erpId
					i['erpId'] = i.seriesId
				})
				this.fullscreenLoading = true
				if (this.propUpType === 'add') {
					setSeriesSave({
						t: arr
					})
						.then(res => {
							if (res.code === 200) {
								this.$message({
									showClose: true,
									message: this.$t('text.addSucceedTip'),
									type: 'success'
								})
								this.fullscreenLoading = false
								this.getCancle()
							}
						})
						.catch(err => {
							this.fullscreenLoading = false
						})

				} else {
					setSeriesUpdate({
						t: arr
					})
						.then(res => {
							if (res.code === 200) {
								this.$message({
									showClose: true,
									message: this.$t('text.editSucceedTip'),
									type: 'success'
								})
								this.fullscreenLoading = false
								this.getCancle()
							}
						})
						.finally(() => {
							this.fullscreenLoading = false
						})
				}
			}
		},
		// 详情
		getInfo(id) {
			const loading = this.$loading({
				lock: true,
				text: this.$t('text.loading'),
				spinner: 'el-icon-loading',
				background: 'rgba(0, 0, 0, 0.7)'
			})
			getSeriesInfo(id).then(res => {
				if (res.code === 200) {
					var arr = res.data.t || []
					if (arr.length > 0) {
						this.setInfoData(arr)
					}
					loading.close()
				}
			}).catch(() => {
				loading.close()
			})
		},

		// 详情数据处理
		setInfoData(data) {
			this.$nextTick(() => {
				var newArr = []
				var arr = data
				var newObj = arr[0]
				if (this.propUpType !== 'detail') {
					this.languageList.map(i => {
						var obj = {
							langId: i.id,
							id: newObj.id,
							brandId: newObj.brandId, // 品牌id
							brandName: newObj.brandName, // 品牌名称
							name: '', // 车系名称-多语言
							seriesId: newObj.seriesId,//车系id
							banner: [], //车辆图片--多语言
							seriesImg: newObj.seriesImg,//车系主图
							thumbnail: newObj.thumbnail, // 缩略图
							video: "",//车系视频-多语言
							parametersFile: "",//车系参数
							guidanceMax: newObj.guidanceMax, //最高指导价
							guidanceMin: newObj.guidanceMin, //最低指导价
							carLevel: newObj.carLevel, //车辆级别
							energyType: newObj.energyType, //能源类型
							enduranceMax: newObj.enduranceMax, //最大续航
							enduranceMin: newObj.enduranceMin, //最小续航
							stock: newObj.stock,//库存 0：无 1：有
							starLevel: newObj.starLevel,//三星 五星
							context: '',//图文详情-多语言
							remark: '',//备注-多语言
							status: newObj.id, // 状态 -1:删除 0:无效 1:有效
						}
						newArr.push(obj)
					})
				} else {
					this.languageList.map(i => {
						var obj = {
							langId: i.id,
							id: '',
							brandId: '', // 品牌id
							brandName: '', // 品牌名称
							name: '', // 车系名称
							seriesId: '',//车系id
							banner: [], //车辆图片
							thumbnail: '', // 缩略图
							seriesImg: '',//车系主图
							video: '',//车系视频
							carLevel: '', //车辆级别
							parametersFile: '',//车系参数 //1702435360563
							energyType: '', //能源类型
							guidanceMax: '', //最高指导价
							guidanceMin: '', //最低指导价
							enduranceMax: '', //最大续航
							enduranceMin: '', //最小续航
							stock: '',//库存 0：无 1：有
							starLevel: '',//三星 五星
							context: '',//图文详情
							remark: "",//备注
							status: 1, // 状态 -1:删除 0:无效 1:有效
						}
						newArr.push(obj)
					})
				}

				arr.map(j => {
					if (j.banner) {
						// 处理banner字段
						j.banner = j.banner.split(',')
					}
					// 根据id进行对象替换
					let index = newArr.findIndex(e =>
						e.langId == j.langId
					)
					if (index > -1) {
						newArr[index] = j
					}
				})
				this.info.list = newArr
			})
			if (this.$route.query.propUpType === 'edit') {
				this.init("1,3,4")
			}
		},

		// 取消
		getCancle() {
			this.$store.state.tagsView.visitedViews.splice(
				this.$store.state.tagsView.visitedViews.findIndex(
					item => item.path === this.$route.path
				),
				1
			)
			this.$router.go(-1)
		}
	}
}
</script>
<style lang="scss" scoped>
.vehicle-manager-info {
	height: 100%;
	width: 100%;
	padding: 20px;
	box-sizing: border-box;
	overflow: hidden;

	&>.main_content {
		width: 99.9%;
		height: 100%;

		&>.main_content_title {
			margin-bottom: 10px;
			display: flex;
			flex-direction: row;
			justify-content: space-between;
			align-items: center;
		}

		.main_content_con {
			height: calc(100% - 40px);
			width: 100%;
			display: inline-block;
			border: 1px solid #dfe6ec;
			padding: 20px;


			&>.el-form {
				width: 100%;
				height: calc(100% - 108px);
				margin-top: 20px;
				overflow: hidden;

				&>.el-form {
					width: 100%;
					height: 100%;
				}

				::v-deep .content_info {
					width: 100%;
					height: 100%;
					overflow: hidden;
					overflow-y: auto;

					.line {
						height: 1px;
						border: 1px solid #ebeef5;
					}

					.el-table {
						::v-deep th {
							line-height: 40px;
							padding: unset;
							background-color: #f2f2f2;
						}
					}
				}
			}

			.footerBtn {
				width: 100%;
				display: flex;
				justify-content: center;
				padding-top: 10px;
			}

			.el-button:hover,
			.el-button:focus {
				color: #000;
			}
		}
	}
}
</style>
